<%@ page language="java" pageEncoding="ISO-8859-1"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<script>
	function toggleArea(area, isPercentage) {
		if(area == 1 && isPercentage == 'true') {
			document.getElementById('bonusArea').style.display = 'block';
			document.getElementById('bonusValidArea').style.display = 'block';
		} else if(area == 1 && isPercentage == 'false') {
			document.getElementById('bonusArea').style.display = 'none';
			document.getElementById('bonusValidArea').style.display = 'none';
		} else if(area == 2 && isPercentage == 'true') {
			document.getElementById('percentageArea').style.display = 'block';
			document.getElementById('percentageValidArea').style.display = 'block';
			document.getElementById('percentageChangeArea').style.display = 'block';
		} else if(area == 2 && isPercentage == 'false') {
			document.getElementById('percentageArea').style.display = 'none';
			document.getElementById('percentageValidArea').style.display = 'none';
			document.getElementById('percentageChangeArea').style.display = 'none';
		}
	}
</script>
<s:form theme="simple" method="post" action="updateAffiliateProgram.htm"
	id="form">
	<table width="100%">
		<tbody>
			<tr>
				<td height="40" class="sectionheading bottom-border">
					Affiliate Program
				</td>
			</tr>
			<tr>
				<td>
					<s:actionmessage/>
					<s:actionerror/>
					<s:fielderror/>
				</td>
			</tr>
			<tr>
				<td>
					<table class="verdana12blacknormal" width="100%" border="0" cellspacing="5" cellpadding="0">
						<tr>
							<td align="right" width="50%">
								Type of payment :&nbsp;
							</td>
							<td width="50%">
								<s:checkbox name="affiliateSettings.isBonus" value="%{affiliateSettings.isBonus}" onclick="toggleArea(1, this.value)"></s:checkbox> One time bonus
								<s:checkbox name="affiliateSettings.isPercentage" value="%{affiliateSettings.isPercentage}" onclick="toggleArea(2, this.value)"></s:checkbox> Percentage
							</td>
						</tr>
						<tr>
							<td colspan="2">
								<div id="bonusArea">
								<table class="verdana12blacknormal" width="100%" cellpadding="0" cellspacing="0">
									<tr>
										<td align="right" width="50%">
											Amount of bonus :&nbsp;
										</td>
										<td>
											<s:textfield name="affiliateSettings.bonusAmount" value="%{affiliateSettings.bonusAmount}" cssClass="Textfiled-border" />
										</td>
									</tr>
								</table>
								</div>
							</td>
						</tr>
						<tr>
							<td colspan="2">
								<div id="bonusValidArea">
								<table class="verdana12blacknormal" width="100%" cellpadding="0" cellspacing="0">
									<tr>
										<td align="right" width="50%">
											Bonus is valid till :&nbsp;
										</td>
										<td>
											<s:select name="affiliateSettings.bonusValidTill" value="%{affiliateSettings.bonusValidTill}" cssClass="Textfiled-border" list="#{'0':'Life time','1':'1 Month','2':'2 Months','3':'3 Months','4':'4 Months','5':'5 Months','6':'6 Months','7':'7 Months','8':'8 Months','9':'9 Months','10':'10 Months','11':'11 Months','12':'12 Months'}"></s:select>
										</td>
									</tr>
								</table>
								</div>
							</td>
						</tr>
						<tr>
							<td colspan="2">
								<div id="percentageArea">
								<table class="verdana12blacknormal" width="100%" cellpadding="0" cellspacing="0">
									<tr>
										<td align="right" width="50%">
											Percentage of bonus :&nbsp;
										</td>
										<td>
											<s:textfield name="affiliateSettings.bonusPercentage" value="%{affiliateSettings.bonusPercentage}" cssClass="Textfiled-border" />
											% (On every successful sell)
										</td>
									</tr>
								</table>
								</div>
							</td>
						</tr>
						<tr>
							<td colspan="2">
								<div id="percentageValidArea">
								<table class="verdana12blacknormal" width="100%" cellpadding="0" cellspacing="0">
									<tr>
										<td align="right" width="50%">
											Percentage is valid till :&nbsp;
										</td>
										<td>
											<s:select name="affiliateSettings.percentageValidTill" value="%{affiliateSettings.percentageValidTill}" cssClass="Textfiled-border" list="#{'0':'Life time','1':'1 Month','2':'2 Months','3':'3 Months','4':'4 Months','5':'5 Months','6':'6 Months','7':'7 Months','8':'8 Months','9':'9 Months','10':'10 Months','11':'11 Months','12':'12 Months'}"></s:select>
										</td>
									</tr>
								</table>
								</div>
							</td>
						</tr>
						<tr>
							<td colspan="2">
								<div id="percentageChangeArea">
								<table class="verdana12blacknormal" width="100%" cellpadding="0" cellspacing="0">
									<tr>
										<td align="right" width="50%">
											Change percentage every month :&nbsp;
										</td>
										<td>
											<s:textfield name="affiliateSettings.percentageChange" value="%{affiliateSettings.percentageChange}" cssClass="Textfiled-border" />
										</td>
									</tr>
								</table>
								</div>
							</td>
						</tr>
						<tr>
							<td colspan="2" align="center">&nbsp;</td>
						</tr>
						<tr>
							<td colspan="2" align="center">
								<s:submit type="image"
									src="../Admin-Images/save-chagnes-button.gif" />
								<img style="cursor: pointer;"
									onclick="document.getElementById('form').reset();"
									src="../Admin-Images/reset-button.gif" alt="Reset">
							</td>
						</tr>
					</table>
				</td>
			</tr>
		</tbody>
	</table>
	<s:hidden name="affiliateSettings.id" value="%{affiliateSettings.id}" />
</s:form>
<s:if test="%{affiliateSettings.isPercentage}">
	<script>toggleArea(2, 'true')</script>
</s:if>
<s:else>
	<script>toggleArea(2, 'false')</script>
</s:else>
<s:if test="%{affiliateSettings.isBonus}">
	<script>toggleArea(1, 'true')</script>
</s:if>
<s:else>
	<script>toggleArea(1, 'false')</script>
</s:else>